Introduction to Java/Swing 


may be distributed to different machine architectures, and a native-code interpreter on each 

architecture interprets the Java code. The core functions found in the Java interpreter are called 
the JFC (Java Foundation Classes). JFC provides generally useful classes, including classes for 
GUIs, accessability and 2D drawing. The original GUI classes in Java are known as AWT - the 
Abstract Windowing Toolkit. AWT provides basic GUI functions such as buttons, frames and 
dialogs, and is implemented in native code in the Java interpreter. 


J ava is commonly used for deploying applications across a network. Compiled Java code 


By contrast, Swing is not implemented in native code - instead it is implemented in AWT. Swing 
and AWT can (and normally do) coexist - we may use the buttons from Swing, alongside AWT 
event handlers. 


The advantages of Swing are: 


1. Consistent look-and-feel - The look and feel is consistent across platforms. 
2. Pluggable look-and-feel - The look and feel can be switched on-the-fly. 


3. High-level widgets - the Swing components are useful and flexible. 


In general, the Swing components are easier to use than similar AWT components. 


6.1 How not to use Swing 


The same concerns that applied to Tcl/Tk deployment apply to the use of Swing. If the target 
computers are slow, then the interpreter overhead may make the application frustratingly slow. 
With the rate of increase in speed in processors, this concern is minimized. 


Processor intensive applications written in Java often seem to make the GUI appear slow and 
unresponsive. This is probably due to internal thread scheduling techniques in the interpreter. 
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6.2 Getting started 


There are quite a few development environments for building Java applications and applets, and 
two of them are suggested for use in this course. However - 1f you have something better, or that 
you feel more comfortable with, please just use that. The systems are: 


e j2sdk1.3.1 - the Java development kit from Sun. It includes Java compilers, interpreters, 
debuggers and demo software, and local copies of it for WinXX and LINUX are found 
here: 


— http: //www.comp.nus.edu.sg/'cs3283/ftp/Java/¡2sdk-1_3_1_02-win.exe 
— http://www.comp.nus.edu.sg/'cs3283/ftp/Java/¡2sdk-1_3_1_02-linux-i386.bin 


e Netbeans - A GUI builder for Java applications and applets, again for WinXX and LINUX: 


— http://www.comp.nus.edu.sg/'cs3283/ftp/Java/NetBeansIDE-release331.exe 
— http://www.comp.nus.edu.sg/'cs3283/ftp/Java/NetBeansIDE-release331.tar.gz 


Each of these systems is documented and described at public web sites - look at Sun's Java web 
site, and http://www.netbeans.org. In addition - there are local copies of some of the documenta- 
tion here: 


e The JFC API at http://www.comp.nus.edu.sg/'cs3283/ftp/Java/jfcapi/ 
e The Netbeans API at http://www.comp.nus.edu.sg/'cs3283/ftp/Java/OpenAPls/ 


The Java tutorial at http://www.comp.nus.edu.sg/'cs3283/ftp/Java/JavaTutorial/ 


Swing Connect at http://www.comp.nus.edu.sg/ cs3283/ftp/Java/swingConnect/ 


Once you have installed the ¡2sdk, find the file called SwingSet2.jar, inside the demo heirarchy 
somewhere, and change to the directory. Then try: 


java -j¡ar SwingSet2.jar 


6.3 Swing programming 


In this course I hope to clarify the general style of Swing applications, and show sufficient exam- 
ples to build menu'd GUI applications with interesting graphical interactions. The same strategy 
was used in the introduction to Tcl/Tk. A good book that covers this material in detail is 


The JFC Swing Tutorial, by Kathy Walrath and Mary Campione. 
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The toplevel components provided by Swing are: 


1. JApplet - for applets within web pages 
2. JDialog - for dialog boxes 


3. JFrame - for building applications 


All other Swing components derive from the JComponent class. JComponent provides 


Tool tips - little windows with explanations 


Pluggable look and feel - as described 
e Layour management - items within the component 
e Keyboard action management - Hot keys and so on. 


e And other facilities 


Swing implements an MVC architecture. 


6.3.1 Pluggable look and feel 


It is relatively easy to change the look and feel of an application - here are three: 
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If you wished to use the WinXX look-and-feel, in the main of your application, you can make 
the following call: 


UlManager.setLookAndFeel( "com.sun.java.swing.plaf.windows.WindowsLookAndFeel"); 
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6.4 Example application 


It is traditional to begin with a “Hello World” example, but I will start with “Hello Singapore”, 
and you will have to move up to “Hello World” as you progress. 


CODE LISTING t2.java 


public class t2 extends javax.swing.JFrame ( 
public t2() ( 
initComponents (); 


) 
private void initComponents () ( 
jLlabel2 = new javax.swing.JLabel (); 
addWindowListener (new java.awt.event .WindowAdapter () ( 
public void windowClosing(java.awt.event .WindowEvent evt) ( 


exitForm(evt); 


) 
»; 
jLabel2.setText ("Hello Singapore!") ; 
JLabel2.setHorizontalAlignment (javax.swing.SwingConstants.CENTER); 
getContentPane () .add (jLabel2, jJava.awt.BorderLayout.CENTER); 


pack (); 


, 
private void exitForm(java.awt.event .WindowEvent evt) ( 


System.exit (0); 

, 

public static void main(String args[]) ( 
new t2().show(); 


) 
private javax.swing.JLabel jLabel2; 


This code should not require much explanation - it just instantiates a JLabel, and sets the text 
field. Perhaps the only explanation needed is why it is so large! The code is generated from a 
GUI builder, and follows a particular software architecture. In this presentation of Swing, I will 
use the same, despite the possibility of smaller code-size applications. 


When we compile and run this application we get: 


OM ox 
Hello Singapore! 


J] 


The call to getContentPane returns the contentPane object for the frame - this is a generic 
AWT container for components associated with each JFrame. The addWindowListener call is 
from java.awt.Window, and adds the specified window listener to receive window events from 


this window. 


6.5 Example applet 
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6.5 Example applet 


An equivalent Hello-world applet: 


CODE LISTING 


HelloWorldApp.java 


) 


jLlabell = new 


) 
private javax.swing.JLabel jLabell; 


public class HelloWorldApp extends javax.swing.JApplet (1 
public HelloWorldApp () ( 
initComponents (); 


private void initComponents () ( 


javax.swing.JLabel (); 


JLabel1.setText ("Hello Singapore!") ; 
JLabel1l.setHorizontalAlignment (javax.swing.SwingConstants.CENTER); 
getContentPane () .add (jLabel1l, jJava.awt.BorderLayout.CENTER); 


This code follows the same structure - it just instantiates a JLabel, and sets the text field, although 
in this code, the class extends a JApplet instead of a JFrame. When we compile and run this 
application we get a HelloWorldApp.class file, which has to be referenced in a web page: 


CODE LISTING 


HelloWorldApp.txt 


<!DOCTYPE HTML PUBLIC 

<html> 

The HelloWorld Applet 

<EMBED type a 
java_CODE 
java_ARCHIVE 
WIDTH 


HEIGHT 
</HTML> 


The end result is: 


<BASE HREF="http://www.comp.nus.edu.sg/-hugh/swing/ "> 


"-//W3C//DTD HTML 3.2//EN"> 


<p> 
"application/x-java-applet;¡version=1.1.2" 
"HelloWorldApp.class" 

"applets.jar" 

400 

50 ></EMBED> 
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6.6 Using the netbeans IDE 


Simple programs like the ones just presented may be created using the GUI builder found in net- 
beans (http://www.netbeans.org), using a very small number of button presses and keystrokes. 
Here is a screen shot: 


Es] NetBeans IDE 3.2.1, Release Candidate 2 (Build 89) [Project Default] 


File Edit View Project Build Debug Versioning Tools Window Help 


z Selection Mode 


¿4 This nethod 1s called from wIthin the constructor to 
* in3tial1ze the form. 
*Y WARNTACG: Do AOT modify this code. The content of this method 


* always regenerated by the Form Editor. 


private void initComponentsí) € 
jlabel2 = new javax.swing.JLabel(); 


addWindowListenerínew java.awt.event.HindowAdapter() 4 
public void windowClosingíjava.awt.event.wWindowEve 
exitFormíevt); 
F 
pH; 


jlabel2.setText("Hello Singapore!"); 


jlabel2.setHorizontalAlignmentíjavax.swing.5wingConstz 
getContentPane().addíjlabel2, java.awt.BorderlLayout.CE 


packí); 
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6.7 Containment heirarchies 


Visible and invisible Java/Swing elements are found in a containment heirarchy. At the top level 
we have containers for the different types of application (1.e. an applet, or an application, or a 
dialog). In a middle level we have the panes, and at a lower level the individual components. 


Top-level JFrame 
JApplet 

JDialog 

Mid-level JPanel 
JScrollBar 

JTabbedPane 


Component-level JButton 
JLabel 


Every GUI component must be part of a containment hierarchy!. Each top-level container has 
a content pane, and an optional menu bar, and Java/Swing components are added to either the 
content pane or the menu bar. Every component must be placed somewhere in this containment 
heirarchy, or it will not be visible. 


6.8 Layout management 


Every container has a default layout manager, which may be over-ridden with your own if for 
some reason the existing one is unsatisfactory. The Java platform supplies a range of layout 
managers, but here we will just look briefly at three. Note that these are AWT components, not 
Swing . 


6.8.1 BorderLayout 


BorderLayout is the default layout manager for every content pane, and assists in placing com- 
ponents in the north, south, east, west, and center of the content pane. 


contentPane.add(new JButton("B1"), BorderLayout.NORTH); 


To view the containment hierarchy for any frame or dialog, click its border to select it, and then press Control- 
Shift-F1. A list of the containment hierarchy will be written to the standard output stream. 
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6.8.2 BoxLayout 


BoxLayout puts components in a single row or column. Here is code to create a centered column 
of components: 


pane.setLayout(new BoxLayout(pane, BoxLayout.Y_AXIS)); 
pane.add(label); 

pane.add(Box.createRigidArea(new Dimension(0,)5))); 
pane.adad(...); 


6.8.3 CardLayout 


CardLayout is for when a pane has different components at different times. You may think of it 
as a stack of same-sized cards. 


cards = new JPanel(); 

cards.setL ayout(new CardLayout()); 
cards.add(p1, BUTTONPANEL); 
cards.add(p2, TEXTPANEL); 


You can choose the top card to show: 
CardLayout cl = (CardLayout)(cards.getLayout()); 
cl.show(cards, (String)evt.getltem()); 


6.9 Creating menus 


The menu classes are descendants of JComponent, and may be used in any higher-level con- 
tainer class (JApplet and so on). Here is a small example of a simple menu application, given in 
the netbeans program style: 


6.10 Threads in Swing 
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CODE LISTING menutest.java 


) 


) 


) 


) 


) 


The end result is: 


public static void main(String args 


public class menutest extends javax.swing.JFrame ( 
public menutest () ( 


initComponents (); 


private void initComponents () ( 
jMenuBarl = new jJavax.swing.JMenuBar (); 
jMenul = new Javax.swing.JMenu (); 
jMenulteml = new jJavax.swing.JMenultem(); 
jMenultem2 = new jJavax.swing.JMenultem(); 
jMenultem3 = new jJavax.swing.JMenultem(); 
jMenu2 = new Javax.swing.JMenu(); 


jMenultem4 = new javax.swing.JMenultem(); 
jMenul.setText ("File"); 
jMenulteml.setText ("Open"); 
jMenul.add (jMenulteml); 
jMenultem2.setText ("Close") ; 
jMenul.add (jMenultem2); 
jMenultem3.setText ("Quit"); 
jMenultem3.addActionListener (new java.awt.event.ActionListener () ( 
public void actionPerformed (java.awt.event.ActionEvent evt) ( 
jMenultem3ActionPerformed (evt); 
) 
y; 
jMenul .add (jMenultem3); 
jMenuBarl.add (jMenul); 
jMenu2.setText ("Edit") ; 
jMenultem4.setText ("Cut"); 
jMenu2 . add (jMenultem4); 
jMenuBarl.add (jJMenu2); 
addWindowListener (new java.awt.event .WindowAdapter () ( 
public void windowClosing(java.awt.event .WindowEvent evt) ( 
exitForm(evt); 
) 
DD; 
setJMenuBar (jMenuBarl); 
pack (); 


private void jMenultem3ActionPerformed (java.awt.event.ActionEvent evt) ( 


System.exit (0); 


private void exitForm(java.awt.event .WindowEvent evt) (1 


System.exit (0); 


new menutest () .show(); 


private javax.swing.JMenuBar jMenuBarl; 
private javax.swing.JMenu jMenul; 
private javax.swing.JMenultem jMenulteml; 
private javax.swing.JMenultem jMenultem2; 
private javax.swing.JMenultem jMenultem3; 
private javax.swing.JMenu jMenu2; 
private javax.swing.JMenultem jMenultem4; 


O ax 
[File | Edit 
Open 
Close 
Quit 


6.10 Threads in Swing 


Java supports a multi-threading mechanism that is sometimes useful. User programs and applets 
may create several threads to manage different parts of the application. As in any multi-threaded 
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system, we may have critical sections 1f two threads attempt to access the same variables at the 
same time. To create threads there are some helpful classes such as SwingWorker or Timer. 


Most Swing components are not thread safe - this means that if two threads call methods on the 
same Swing component, the results are not guaranteed. The single-thread rule: 


Swing components can be accessed by only one thread at a time. 


A particular thread, the event-dispatching thread, is the one that normally accesses Swing com- 
ponents. To get access to this thread from another thread we can use invokeLater() or invoke- 
AndWait(). 


6.10.1 Creating threads 


Many applications do not require threading, but if you do have threads, then you may have 
problems debugging your programs. However, you might consider using threads if: 


e Your application has to do some long task, or wait for an external event, without freezing 
the display. 


e Your application has to do someting at fixed time intervals. 


The following two classes are used to implement threads: 


1. SwingWorker?: To create a thread 


2. Timer: Creates a timed thread 


To use SwingWorker, create a subclass of it, and in the subclass, implement your own con- 
struct() method. When you instantiate the SwingWorker subclass, the runtime environment 
creates a thread but does not start it. The thread starts when you invoke start() on the object. 


Here's an example of using SwingWorker from the tutorial - an image is to be loaded over a 
network (given a URL). This may of course take quite a while, so we don't block our main 
thread - (1f we did this, the GUI may freeze). 


The following code shows the better way of loading the remote image: 


21f you fi nd that your distribution does not include SwingWorker.class, download and compile it. 
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CODE LISTING ImageLoader.java 


private void loadImage (final String imagePath, 
final int index) ( 
final SwingWorker worker = new SwingWorker () ( 
Imagelcon icon = null; 
public Object construct () ( 
icon = new Imagelcon (getURL(imagePath)); 
return icon; 
) 
public void finished() ( 


Photo pic = (Photo)pictures.elementAt (index); 
pic.setIcon(icon); 
if (index == current) 


updatePhotograph (index, pic); 
, 


7 
worker.start (); 


The Timer class is used to repeatedly perform an operation. When you create a Timer, you 
specify its frequency, and you specify which object is the listener for its events. Once you start 
the timer, the action listener”s actionPerformed() method will be called for each event. 


6.10.2 Event dispatching thread 


The event-dispatching thread is the main event-handling thread. It is normal for all GUI code to 
be called from this main thread, even 1f some of the code may take a long time to run. However 
- we have already mentioned that we should not delay the event-dispatching thread. 


Swing provides a solution to this - the InvokeLater() method may be used to safely run code 
in the event-dispatching thread. The method requests that some code be executed in the event- 
dispatching thread, but returns immediately, without waiting for the code to execute. 


Runnable doWorkRunnable = new Runnable() [ 
public void run() [ doWork(); ] 


A 


SwinguUtilities..nvokeLater(doWorkRunnable); 


6.11 Handling events 


Actions associated with Java/Swing components raise events - moving the mouse or clicking a 
JButton all cause events to be raised. The application program writes a listener method to process 
an event, and registers it as an event listener on the event source. There are different kinds of 
events, and we use different kinds of listener to act on them. For example: 
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MouseMotionListener 
List selection changes 


The listener methods are passed an event object which gives information about the event and 
identifies the event source. 


6.11.1 Event handlers 


When you write an event handler, you must do the following; 


e Specify a class that either implements a listener interface or extends a class that implements 
a listener interface. 


public class MyClass implements ActionListener ( ... 


e Register an instance of the class as a listener upon the components. 


Component.addActionListener(instanceOfMyClass); 


e Implements the methods in the listener interface. 


public void actionPerformed(ActionEvent e) [ 
...//code that reacts to the action... 


) 


Make sure that your event handler code executes quickly, or your program may seem to be slow. 
In the sample code given so far, we have used window listeners to react 1f someone closes a 
window, but not to capture other sorts of events. 
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6.11.2 Handling events 


CODE LISTING CheckBoxDemo.java 


import java.awt.*; 
import java.awt.event.*; 
import javax.swing.*; 


public class CheckBoxDemo extends JPanel ( 

JCheckBox chinButton; 

JCheckBox glassesButton; 

StringBuffer choices; 

JLabel pic; 

public CheckBoxDemo () ( 
chinButton = new JCheckBox ("Chin"); 
glassesButton = new JCheckBox ("Glasses") ; 
CheckBoxListener myListener = new CheckBoxListener (); 
chinButton.addItemListener (myListener); 
glassesButton.addItemListener (myListener); 
choices = new StringBuffer ("-—ht"); 
pic = new JLabel (new Imagelcon( "geek-" + choices.toString() + ".gif")); 
pic.setToolTipText (choices.toString()); 
JPanel checkPanel = new JPanel (); 
checkPanel.setLayout (new GridLayout (0, 1)); 
checkPanel .add (chinButton); 
checkPanel .add (glassesButton); 
setLayout (new BorderLayout ()); 
add (checkPanel, BorderlLayout .WEST); 
add (pic, BorderLayout.CENTER); 
setBorder (BorderFactory.createEmptyBorder (20,20,20,20)); 

J 

class CheckBoxListener implements ItemlListener ( 
public void itemStateChanged (ItemEvent e) ( 


int index = 0; 
char e = "=="; 
Object source = e.getltemSelectable(); 
if (source == chinButton) ( 
index = 0; 
c="C0C'; 
) else if (source == glassesButton) ( 
index = 1; 
c="9g'; 
) 
if (e.getStateChange() == ItemEvent .DESELECTED) 
a a 


; 
choices.setCharAt (index, Cc); 
pic.setIcon(new Imagelcon( "geek-" + choices.toString() + ".gif")); 
pic.setToolTipText (choices.toString()); 
) 
) 
public static void main(String s[]) ( 
JFrame frame = new JFrame ("CheckBoxDemo") ; 
frame .addWindowListener (new WindowAdapter () ( 
public void windowClosing (WindowEvent e) ( 
System.exit (0); 
) 


DY; 

frame.setContentPane (new CheckBoxDemo ()); 
frame.pack (); 

frame.setVisible(true); 


Here is an example of event handling code, simplified from the tutorial. It displays a small 
graphic, and has two checkboxes. When you change either checkbox, an itemListener responds 
to the event and changes the graphic. 
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6.12 Summary of topics 


In this “JFC, Java and Swing” module, we introduced the following topics: 


e Simple first programs and tool sets for Java/Swing 


e The containment heirarchy 


e Layout managers and menus 


e Threading and event handling 


Questions for module 6 


RR Bb un 


. What is meant by “the MVC architecture” mentioned in section 6.37 

. Investigate how you would create a “ToolTip” in Tcl/Tk - give code to demonstrate. 

. Investigate how you would create a “ToolTip” in Java/Swing - give code to demonstrate. 
. Write a minimal Java/Swing application which has a single File menu with a Quit item. 


. The javax.swing.UlManager class is used to manipulate the look-and-feel of an applica- 


tion. How can you discover which look-and-feel strategies are implemented in the Java 
development environment? 


. Research the root pane that comes with every highest level container in Java Swing. Briefly 


describe each of its components and state what each could be used for. 


. Give code for a small menu-style application which makes the console beep whenever a 


menu item is selected. 


. Give layout management code for the following: 


6.12 Summary of topics 


Further study 


e The JFC API at http://www.comp.nus.edu.sg/'cs3283/ftp/Java/jfcapi/ 
The Netbeans APT at http: //www.comp.nus.edu.sg/"cs3283/ftp/Java/OpenAPIs/ 


The Java tutorial at http://www.comp.nus.edu.sg/'cs3283/ftp/Java/JavaTutorial/ 
e Swing Comnect at http://www.comp.nus.edu.sg/'cs3283/ftp/Java/swingConnect/ 
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